<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ajax异步操作</title>
    <!--
       引入vue + axios
          是因为我们要发送异步请求，这是我们之前学的技术
    -->
    <script src="js/vue-v2.6.11.js"></script>
    <script src="js/axios-0.18.0.js"></script>
</head>
<body>
  <div id="app">
      <button @click="testGet()">get请求方式完成异步操作</button>
      <button @click="testPost()">post请求方式完成异步操作</button>
  </div>
</body>
<script>
    var vue =  new Vue({
          el:"#app",//绑定指定的div
          data:{//模型数据
             message:"呵呵"
          },
          methods:{
              testGet(){
                 axios.get("/ajax/testGet2.do?id=1&name=jack").then((res)=>{

                     //res是响应对象  响应数据在哪？
                     console.log("后端响应的数据是:"+res.data);
                     this.message=res.data;

                 }).catch((err)=>{
                     console.log("响应失败"+err);
                 });
              },
              testPost(){
                  // 有个json格式数据
                  var param={
                      id:2,
                      name:"张三"
                  }
                  // 1:前端 把一个json格式数据传递到后端  后端怎么处理
                  // 2：前端 希望后端给 json格式数据 后端怎么给！
                  axios.post("/ajax/testPost.do",param).then((res)=>{

                  }).catch((err)=>{});
              }
          }
      })
</script>
</html>